<template>
  <el-form
    :model="formData"
    :rules="rules"
    ref="formRef"
    :inline="inline"
    :label-width="labelWidth"
    :size="size"
  >
    <slot></slot>
  </el-form>
</template>

<script>
export default {
  name: 'CommonForm',
  props: {
    formData: {
      type: Object,
      required: true
    },
    rules: {
      type: Object,
      default: () => ({})
    },
    inline: {
      type: Boolean,
      default: false
    },
    labelWidth: {
      type: String,
      default: '120px'
    },
    size: {
      type: String,
      default: 'medium'
    }
  },
  methods: {
    // 表单验证
    validate(callback) {
      this.$refs.formRef.validate(callback);
    },
    // 清除验证
    clearValidate(props) {
      this.$refs.formRef.clearValidate(props);
    },
    // 重置表单
    resetFields() {
      this.$refs.formRef.resetFields();
    }
  }
};
</script>

<style scoped>
</style>